<template>
    <view class="page">
        <!-- 卡片提示 -->
        <view class="g-tips">
            <view class="g-user-info userbg">
				<view class="circles"><text class="circle1"></text><text class="circle2"></text><text class="circle3"></text></view>
				<view class="u-user-name">{{left.text}}</view>
                <view class="u-user-price">{{left.price}}</view>
            </view>
            <view class="g-tips-text" @tap="trun">
                <image src="../../../static/icons/agent_jewel/agent_i10.png"></image>
            </view>
            <view class="g-user-info elsebg">
				<view class="circles"><text class="circle1"></text><text class="circle2"></text><text class="circle3"></text></view>
				<view class="u-user-name">{{right.text}}</view>
				<view class="u-user-price">{{right.price}}</view>
            </view>
        </view>
        <!-- 输入 -->
        <view class="g-tips2">
            <text>{{Text.top}}&nbsp;</text>
            <text class="price">￥{{Text.price}}</text>
        </view>
        <label class="g-input">
            <view>{{Text.bottom}}&nbsp;<text>￥</text></view>
            <input type="number" v-model="nPrice" placeholder="请输入数量">
        </label>
        
        
        <view class="g-tips3">
			<view class="title">-互转须知-</view>
            <view>1.互转需支付2%手续费。</view>
            <view>2.转出后若未及时到账，请联系客服人员！<br>客服热线：4008-338-381</view>
        </view>
        <button class="u-confirm" @tap="confirm">转出</button>
        
        <!-- 成功弹出 -->
        <!-- <view class="g-popup" v-if="isTransOk">
            <view class="g-popup-info">
                <image class="u-popup-sign" src="../../static/images/user/seleted.png" mode="widthFix"></image>
                <view class="u-popup-title">互转成功</view>
                <view class="u-popup-desc">互转后即时到账，若未及时到账请联系客服人员</view>
				<view class="g-popup-user">
					<view class="item">
						<text>收粮ID</text>
						<text>{{nUserId}}</text>
					</view>
					<view class="item">
						<text>转出米粮</text>
						<text>¥{{nPrice}}</text>
					</view>
					<view class="item">
						<text>实际收粮</text>
						<text class="red">¥{{in_money}}</text>
					</view>
				</view>
            </view>
			<view class="btns">
				<button class="u-confirm" @tap="closePopup()">返回</button>
				<button class="u-confirm" @tap="closePopup('deital')">查看明细</button>
			</view>
        </view> -->
		
		<view class="m-loading" v-if="isShowLoading">
		    <image src="../../../static/images/loading.gif" mode="widthFix"></image>
		    <text>加载中</text>
		</view>
    </view>
</template>

<script>
    import henglang from '@/common/common_zb.js'
    export default {
        data() {
            return {
                nPrice: '',
				isShowLoading: false,
				isTrun:false,
				left:{
					text:'',
					price:''
				},
				right:{
					text:'',
					price:''
				},
				Text:{
					top:'',
					bottom:'',
					price:0
				},
				data:[
					{
						text:'千吉宝(元)',
						price:0
					},
					{
						text:'寄存(元)',
						price:0
					}
				],
				textData:[
					{
						top:'可转',
						bottom:'转入寄存'
					},
					{
						top:'寄存',
						bottom:'转入千吉宝'
					}
				],
				makerInfo:{}
            }
        },
        methods: {
            confirm() {
				let that = this
                if(!that.nPrice || Number(that.nPrice) <= 0){
					henglang.showToast('请输入正确的数量')
				}else{
					uni.hideKeyboard()
					let type = ''
					if(that.isTrun){
						type = 2
					}else{
						type = 1
					}
					uni.navigateTo({
						url:'/pages/jewel/agent_jewel/checkpwd?amount=' + that.nPrice + '&type=' + type
					})
				}
            },
			
    //         closePopup(val) {
				// this.isTransOk = false;
				// if(val == 'deital'){
				// 	uni.redirectTo({
				// 		url:'/pages/common/bill?type=1'
				// 	})
				// }else{
				// 	uni.redirectTo({
				// 		url:'/pages/user/hl_transform'
				// 	})
				// }
    //         },
			trun(){
				let that = this
				that.isTrun = !that.isTrun
				if(that.isTrun){
					that.left = that.data[1]
					that.right = that.data[0]
					that.Text = that.textData[1]
					that.Text.price = that.makerInfo.keep_money
				}else{
					that.left = that.data[0]
					that.right = that.data[1]
					that.Text = that.textData[0]
					that.Text.price = that.makerInfo.useable_money
				}
			}
        },
        onReady() {
			let that = this
			that.isShowLoading = true
			that.left = that.data[0]
			that.right = that.data[1]
			that.Text = that.textData[0]
			henglang.get('member/hasPaypwd',{},true,function(res){
				if(!res.data.data.has_paypwd){
					henglang.showToast('请先设置支付密码')
					setTimeout(() => {
						uni.navigateTo({
							url:'/pages/user/settings/set_checkpwd'
						})
					}, 3000)
				}
			});
			henglang.get('agent_jewel/getInfo',{},true,function(res){
				that.isShowLoading = false;
				that.makerInfo = res.data.data
				that.data[0].price = that.makerInfo.useable_money
				that.data[1].price = that.makerInfo.keep_money
				that.Text.price = that.makerInfo.useable_money
			})
        },
		onNavigationBarButtonTap(e) {
		    if (e.index == 0) {
				uni.navigateTo({
					url:'/pages/jewel/agent_jewel/transform_list'
				})
		    }
		}
    }
</script>

<style>
	.userbg{
		background-image: linear-gradient(to right, #f6b6b6 , #ffffff);
		box-shadow: 0 7rpx 10rpx rgba(93,15,13,0.16);
	}
	.elsebg{
		background-image: linear-gradient(to right, #f6d1b6 , #ffffff);
		box-shadow: 0 7rpx 10rpx rgba(93,15,13,0.16);
	}
    .page {
        background: #ffffff;
        min-height: 100vh;
    }
    
    /* 卡片提示 */
    .g-tips {
        padding: 20px 0 30px 0;
        background: #fff;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .g-user-info {
        width: 246upx;
        color: #fff;
        font-size: 24upx;
		height: 167upx;
		border-radius: 10upx 0 0 10rpx;
		position: relative;
		z-index: 1;
		padding-left: 30rpx;
		overflow: hidden;
    }
	.g-user-info .u-user-name{
		font-size: 28rpx;
		color: #1e1e1e;
		padding-top: 42rpx;
	}
	.g-user-info .u-user-price{
		font-size: 38rpx;
		color: #d71511;
	}
    .g-tips-text {
        text-align: center;
        margin: 0 24upx;
    }
	.g-tips-text image{
	    width: 89rpx;
		height: 89rpx;
	}
	.g-user-info .circles text{
		background: rgba(255,255,255,0.15);
		position: absolute;
		z-index: 1;
		border-radius: 50%;
	}
	.g-user-info .circle1{
		width: 138rpx;
		height: 138rpx;
		left: -29rpx;
		top: -19rpx;
	}
	.g-user-info .circle2{
		width: 38rpx;
		height: 38rpx;
		left: 132rpx;
		top: 45rpx;
	}
	.g-user-info .circle3{
		width: 16rpx;
		height: 16rpx;
		right: 87rpx;
		top: 26rpx;
	}
	

    /* 输入 */
    .g-input {
        display: flex;
        align-items: center;
        padding: 30rpx 20rpx;
        background: #fff;
        position: relative;
		color: #303030;
		font-size: 34rpx;
    }
	.g-input text{
		color: #e62c2c;
		padding-left: 10rpx;
	}
	.g-input input{
		color: #e62c2c;
	}

    .g-pay-way {
        margin-top: 20upx;
    }
    .g-tips2 {
        padding: 10px 0 10px 10px;
		color: #303030;
		font-size: 32rpx;
		background: #f6f6f6;
    }
	.g-tips2 .price{
		font-size: 34upx;
		color: #e62c2c;
		margin-left: 10upx;
	}
    .g-tips3 {
        padding: 20rpx 40rpx;
        background: #f6f6f6;
        color: #363636;
		font-size: 26rpx;
		line-height: 40rpx;
    }
	.g-tips3 .title{
		color: #303030;
		font-size: 32rpx;
		font-weight: bold;
		text-align: center;
		padding: 20rpx 0;
	}
    .u-confirm {
		flex: 1;
        background: #d71611;
		margin: 50upx 20upx;
        color: #fff;
        padding: 12px 0;
        border-radius: 100px;
        box-shadow: 0 0 10px rgba(0,0,0,.2);
    }
    
    /* 弹框 */
    .g-popup {
        position: fixed;
        top: 0;
        left: 0;
        background: #f2f2f2;
        width: 100%;
        box-sizing: border-box;
        height: 100vh;
        z-index: 9;
    }
    .g-popup-info {
		width: 669upx;
		height: 605upx;
		background-image: url('~@/static/images/user/card3.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		margin: 0 auto;
		margin-top: 40upx;
		position: relative;
    }
    .u-popup-sign {
        width: 180upx;
        height: 180upx;
		display: block;
		margin: 0 auto;
		padding: 40upx 0;
    }
    .u-popup-title {
        font-weight: bold;
        font-size: 32upx;
		text-align: center;
    }
    .u-popup-desc {
        color: #888;
		text-align: center;
		padding-top: 10upx;
    }
    
    .g-popup-user {
		position: absolute;
		bottom: 10upx;
		left: 0;
		padding: 0 10%;
		width: 80%;
    }
	.g-popup-user .item{
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding-bottom: 5upx;
	}
    .u-price-tips {
        max-width: 120upx;
        word-break: break-word;
    }
	.g-popup .btns{
		display: flex;
		align-items: center;
		justify-content: center;
	}
</style>
